<!-- 表行 》 开关 》 展示 -->

<template>
  <div :class="`CoreWeb-Row${this.$options.name}`">
    <el-switch
      v-if="CORE.isNumber(value) || value"
      :value="value"
      :width="switchWidth"
      :active-value="trueValue"
      :inactive-value="falseValue"
      disabled
    />
    <span v-else>{{ empty }}</span>
  </div>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import TitleBtn from '../../RowTitle/TitleBtn'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'SwitchShow',

  /**
   * 属性注册 (抽取以便查阅)
   */
  props: {
    ...CORE.WEB.RowCommon,
    ...CORE.WEB.RowSwitch,
    row: { type: Object, required: true }, // 行数据
  },

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 绑定值
     */
    value: TitleBtn.computed.value,
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 获取绑定值
     */
    getValue: TitleBtn.methods.getValue,
  },
}
</script>
